* {
	margin: 0;
	padding: 0;
}

/* 16px = 12pt = 100% = 1em */
body {
    background-image: url(../img/bg.png);
    background-color: #F9F9F9;
	font-family: "chaletmedium",Arial,Helvetica,Verdana;
}

header{
    margin: 0 auto;
    width: 960px;
    padding: 10px;
}

#logo {
    display: inline-block;
    width: 430px;
}

#socialmedia{
    clear: both;
    color: #000000;
    float: right;
    font-size: .8em;
    margin-top: 10px;
    text-align: right;
    max-width: 450px;
}

#socialmedia img:hover {
    transform:scale(1.2);
    -webkit-transform:scale(1.2);
    -moz-transform:scale(1.2);
    -o-transform:scale(1.2);
    -ms-transform:scale(1.2);
}

nav{
    clear: both;
    margin: 0 auto;
    width: 960px;
    height: 145px;
    text-align: center;
    font-size: 1.2em;
    color: #FFFFFF;
}

div.contenedor{
    width: 160px;
    height: 140px;
    float:left;
    -webkit-transition: height .4s;
    -moz-transition: height .4s;
    -o-transition: height .4s;
    -ms-transition: height .4s;
}

div#uno{
    background-color: rgb(193,0,1);
}

div#dos{
    background-color: rgb(252,51,28);
}

div#tres{
    background-color: rgb(255,143,0);
}

div#cuatro{
    background-color: rgb(255,210,33);
}

div#cinco{
    background-color: rgb(199,224,0);
}

div#seis{
    background-color: rgb(82,224,0);
}

p.texto{
    font-size: 1.2em;
    color:white;
    text-align: center;
    padding-top:2px;
    opacity: .6;
    -webkit-transition: padding-top .4s;
    -moz-transition: padding-top .4s;
    -o-transition: padding-top .4s;
    -ms-transition: padding-top .4s;
}

img.icon{
    display: block;
    margin:10px auto;
    background-color: rgba(255,255,255,.15);
    width:40px;
    padding:20px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    -webkit-box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);
    -moz-box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);
    -o-box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);
    -ms-box-shadow: 0px 0px 0px 30px rgba(255,255,255,0);
    -webkit-transition:box-shadow .4s;
    -moz-transition:box-shadow .4s;
    -o-transition:box-shadow .4s;
    -ms-transition:box-shadow .4s;
}

div.contenedor:hover p.texto{
    padding-top: 40px;
    opacity: 1;
}

div.contenedor:hover{
    height:140px;
}

div.contenedor:hover p.texto{
    padding-top: 15px;
    opacity: 1;
}

div.contenedor:hover img.icon{
    -webkit-box-shadow:0px 0px 0px 0px rgba(255,255,255,.6);
    -moz-box-shadow:0px 0px 0px 0px rgba(255,255,255,.6);
    -o-box-shadow:0px 0px 0px 0px rgba(255,255,255,.6);
    -ms-box-shadow:0px 0px 0px 0px rgba(255,255,255,.6);
}

#banner{
    margin: 0 auto;
    width: 960px;
    height: 460px;
    padding: 0px;
}

section#contenedor {
    background-color: #FFFFFF;
    margin: 0 auto;
    margin-top: 20px;
    width: 960px;
    padding: 0;
    -webkit-box-shadow: 2px 2px 5px #999;
    -moz-box-shadow: 2px 2px 5px #999;
    -o-box-shadow: 2px 2px 5px #999;
    -ms-box-shadow: 2px 2px 5px #999;
}

section#principal,aside{
    display: inline-block;
    margin: 0 auto;
    width: 960px;
    vertical-align: top;
    padding: 10px;
    width: 615px;
}

article{
    background-color: #F5F5DC;
    border-radius: 1em;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-size: 0.9em;
    color: #333333;
    padding: 10px;
    text-align: justify;
    margin-bottom: 10px;
}

article img {
    box-shadow: 0 5px 25px rgba(0,0,0,.5);  /* Sombra */
    margin-right: 15px;
    margin-bottom: 15px;
}

article li {
    margin-left: 20px;
}

h1{
    font-family: 'Dancing Script', cursive;
    font-size: 2.8em;
    color: #900;
}

h2{
    font-family: 'Oswald', sans-serif;
    font-size: 2em;
    color:#F60;
    border-bottom: 2px dashed #ccc;
    text-align: center;
}

aside{
    width: 300px;
    padding: 10px;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-size: .8em;
    text-align: justify;
    color: #666;
}

.sombra {
    box-shadow: 0 5px 25px rgba(0,0,0,.5);  /* Sombra */
    text-align: center;
}

#pie {
    background-color: #000000;
    margin-top: 25px;
    width: 100%;
}

footer{
    margin: 0 auto;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-size: .6em;
    color: #FFFFFF;
    width: 960px;
    height: 80px;
    padding: 10px;
}

#pie1 {
    display: inline-block;
    margin-top: 20px;
    width: 430px;
}

#pie2{
    clear: both;
    float: right;
    text-align: right;
    max-width: 450px;
}

#pie2 img:hover {
    transform:scale(1.2);
    -webkit-transform:scale(1.2);
    -moz-transform:scale(1.2);
    -o-transform:scale(1.2);
    -ms-transform:scale(1.2);
}

a.nav1:link {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
text-decoration:none;
color:#FFFFFF;
}

a.nav1:visited {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
text-decoration:none;
color:#FFFFFF;
}

a.nav1:hover {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
color:rgb(199,224,0);
}

.campos {  
    font-family:verdana,arial;     /* tipo de letra */  
    font-size:12px;                /* tamaño de la letra*/   
    color:#999;                 /* color del texto */   
    border: 1px solid #999;        /* color del borde puede ser solid ó dotted */
    padding:5px;
    -moz-border-radius: 6px 6px 6px 6px;
    -webkit-border-radius: 6px 6px 6px 6px;
    border-radius: 6px;  
}  

.boton1{ 
    font-size:12px; 
    font-family:Verdana,Helvetica; 
    font-weight:bold; 
    color:#333;
    padding:10px; 
    background:#CCC;
    border:1px solid #666;
    width:120px; 
    height:40px;
    -moz-border-radius: 6px 6px 6px 6px;
    -webkit-border-radius: 6px 6px 6px 6px;
    border-radius: 6px;   
}

.boton2{ 
    font-size:12px; 
    font-family:Verdana,Helvetica; 
    font-weight:bold; 
    color:#333;
    padding:10px; 
    background:#CCC;
    border:1px solid #666;
    width:120px; 
    height:40px;
    -moz-border-radius: 6px 6px 6px 6px;
    -webkit-border-radius: 6px 6px 6px 6px;
    border-radius: 6px;   
} 


#b_submit {  
    margin: -25px 0px 0px 380px;    /* margen con valores: arriba - derecha - abajo - izquierda */ 
}